<template>
    <div style="margin:5px">
        <!-- 暂未考虑表单验证 -->
        <a-form layout="inline">
            <a-form-item v-for="(item,index) in compFormItemData" :label="item.label" :key="index">
                <compSelector
                 :key="compSelectorkey"
                 v-model="formParam[item.model]"
                 :compType="item.type"
                 v-if="item.type && typeArr.indexOf(item.type) !== -1"
                 :allowClear='item.allowClear?item.allowClear:false'
                 :options="item.dictionaryType?[]:(item.options?item.options:item.optionData)"
                 :width="item.width?item.width:175"
                 :placeholder="item.placeholder?item.placeholder:item.label"
                 :disabled="item.disabled?true:false"
                 :defaultValue="item.defaultValue"
                 :currentValue="item.currentValue"
                 :dictionaryType="item.dictionaryType"
                />
                
                <a-input-number
                 v-else-if="item.type && ecompSearchType.Number === item.type" 
                 :id="'inputNumber'+new Date().getTime()" 
                 v-model:value="formParam[item.model]" 
                 :min="1" :max="10" 
                />
                <a-input
                 v-else
                 :defaultValue="item.defaultValue?item.defaultValue:''" 
                 v-model:value="formParam[item.model]"
                 @keydown="inputkeyDown($event,item)"
                 :placeholder="item.placeholder?item.placeholder : '请输入'+item.label" 
                 :allowClear='item.allowClear?item.allowClear:false'
                />
            </a-form-item>
            <a-form-item>
                <a-button class="blue-btn" type="primary" @click="queryEvents" icon="search">查询</a-button>
                <a-button type="default" @click="resetEvents" icon="reload" style="margin-left: 8px">重置</a-button>
            </a-form-item>
        </a-form>
    </div>
</template>
<script>
import compSelector from '../compSelector/compSelector'
import {typeInput, typeNumber, typeSelect, typeCheckbox, typeRadio} from './ContractType'

export default {
    name: 'compSearchCriteria',
    components:{
        compSelector
    },
    model: {//在父组件可以用自定义组件的v-model获取值
        prop: "value",
        event: "searchHandleChange"
    },
    props: {
        value:{
            type:[Object, String, Number],
            require:false,
        },
        formItem:{
            type:Array,
            default:[]
        }
    },
    data(){
        return{
            ecompSearchType:{
                typeInput:typeInput,
                typeNumber:typeNumber,
                typeSelect:typeSelect,
                typeCheckbox:typeCheckbox,
                typeRadio:typeRadio,
            },
            typeArr:[typeSelect,typeRadio,typeCheckbox],
            formParam:{},
            selectOptions:[],
            resetForm:JSON.parse(JSON.stringify(this.formItem)),//深拷贝传进来的初始值，重置需要用到
            compFormItemData:this.formItem,
            compSelectorkey:'',
        }
    },
    watch:{
        formParam:{
            deep:true,
            handler(newValue,oldValue) {
                //console.log(newValue,oldValue);
            }
        }
    },
    mounted(){
        this.initialValue()
    },
    
    methods:{
        inputkeyDown(e,item){
            //console.log(e,item)
            if(e.code === 'Backspace'){
                this.formParam[item.model] = ''
            }
        },
        initialValue(){
            this.compFormItemData.forEach((item) => {
            this.formParam[item.model] = item.defaultValue?item.defaultValue:''
            this.$emit('searchHandleChange',this.formParam)
        })
        },
        formParamHandle(val){//处理最终数据
            if(JSON.stringify(val) === "{}") return false
            
            for(let key  in val){
                if(Object.prototype.toString.call(val[key]) === '[object Object]'){
                    // dataObj[key+'Name'] = val[key].name//返回名称，暂时先不考虑
                    this.formParam[key] = val[key].value
                }else{
                    this.formParam[key] = val[key]
                }
            }
        },
        //查询
        queryEvents(){
            
            this.formParamHandle(this.formParam)
            this.$emit('searchHandleChange',this.formParam)
        },
        //重置
        resetEvents(){
            this.compSelectorkey = Date.now()
            this.initialValue()
            this.compFormItemData = this.resetForm
            this.formParamHandle(this.formParam)
            this.$emit('searchHandleChange',{...this.formParam,resetEvents:true})
        }
    }
}
</script>
<style>

</style>